<template>
  <div>
    <FormPanel ref="formPanel" :list="formList" :formType="type" @formChange="changeHandle" :isSubmitBtn="false" :collapse="false" labelWidth="110" />
    <div
      :style="{
        position: 'absolute',
        left: 0,
        bottom: 0,
        right: 0,
        zIndex: 9,
        borderTop: '1px solid #e9e9e9',
        padding: '10px 20px',
        background: '#fff',
        textAlign: 'center'
      }"
    >
      <el-button @click="closeDrawer">关 闭</el-button>
      <multiuse-button type="primary" :click="saveHandler">保 存</multiuse-button>
    </div>

    <BaseDialog :visible.sync="isDealer" title="经销商查询" destroyOnClose :containerStyle="{ height: 'calc(100% - 60px)', overflow: 'auto', paddingBottom: '60px' }">
      <SearchDealer :type="type" :rowData="formData" @close="emitCloseHandler" />
    </BaseDialog>
  </div>
</template>
<script>
import { dictionary } from '@/utils/dictMixin';
import { saveRepay, gettmFiAccountType } from '@/api/omFinance/FinanceManage/RepayRecordsImport';
import SearchDealer from './SearchDealer';

export default {
  mixins: [dictionary],
  props: ['type', 'rowData'],
  data() {
    this.saveData = null;
    return {
      formList: this.createdFrom(),
      formData: {},
      accountList: [],
      isDealer: false
    };
  },
  components: {
    SearchDealer
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      if (this.type != 'add') {
        this.formList.map(x => {
          if (x.fieldName == 'dealerCode') {
            x.initialValue = this.rowData['ownerCode'];
            this.gettmFiAccountType(this.rowData['ownerCode']);
          } else {
            x.initialValue = this.rowData[x.fieldName];
          }
        });
      }
    },
    // 资金账户
    async gettmFiAccountType(dealerCode) {
      let res = await gettmFiAccountType({ ownerCode: dealerCode });
      if (res.data.length > 0) {
        this.accountList = res.data;
        this.formList.find(x => x.fieldName == 'accountTypeId').itemList = res.data.map(x => ({ text: x.accountTypeName, value: x.accountTypeId }));
      }
    },
    setItems(type) {
      this.accountList.map(x => {
        if (x.accountTypeId == type) {
          this.formList.map(y => {
            if (y.fieldName == 'creditAmount' || y.fieldName == 'depositRate' || y.fieldName == 'billAmount' || y.fieldName == 'availableAmount') {
              y.initialValue = x[y.fieldName];
            }
          });
        }
      });
    },
    optionCodeSearch() {
      this.isDealer = true;
    },
    emitCloseHandler(val, data) {
      this.isDealer = val;
      if (data) {
        this.formList.find(x => x.fieldName == 'dealerCode').initialValue = data[0].dealerCode;
        this.formList.find(x => x.fieldName == 'dealerName').initialValue = data[0].dealerName;
        this.gettmFiAccountType(data[0].dealerCode);
      }
    },
    changeHandle(val) {
      this.saveData = val;
    },
    closeDrawer(type) {
      this.$emit('close', false, type);
    },
    async saveHandler() {
      this.$refs.formPanel.SUBMIT_FORM();
      if (this.saveData !== null) {
        let saveData = Object.assign({}, this.rowData, this.saveData);
        const res = await saveRepay(saveData);
        if (res.resultCode === 200) {
          await this.closeDrawer('refresh');
        }
      }
    },
    createdFrom() {
      return [
        {
          type: 'INPUT',
          label: '经销商代码',
          fieldName: 'dealerCode',
          placeholder: '请选择',
          readonly: true,
          rules: [{ required: true, message: '请输入', trigger: 'blur' }],
          unitRender: () => {
            return <el-button slot="append" icon="el-icon-search" onClick={() => this.optionCodeSearch()}></el-button>;
          }
        },
        {
          type: 'INPUT',
          label: '经销商名称',
          fieldName: 'dealerName',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '授信额度',
          fieldName: 'creditAmount',
          placeholder: '',
          disabled: true
        },
        {
          type: 'INPUT',
          label: '保证金比例',
          fieldName: 'depositRate',
          placeholder: '',
          disabled: true
        },
        // {
        //   type: 'INPUT',
        //   label: '三方开票金额',
        //   fieldName: 'billAmount',
        //   placeholder: '',
        //   disabled: true
        // },
        {
          type: 'INPUT_NUMBER',
          label: '开票还款金额',
          fieldName: 'repayAmount',
          min: 0,
          max: 999999999,
          placeholder: '请输入',
          rules: [{ required: true, message: '请输入', trigger: 'blur' }]
        },
        {
          type: 'SELECT',
          label: '资金类型',
          fieldName: 'accountTypeId',
          placeholder: '',
          itemList: [],
          rules: [{ required: true, message: '请选择', trigger: 'change' }],
          change: val => {
            if (val) {
              this.setItems(val);
            }
          }
        },
        {
          type: 'INPUT',
          label: '可用余额',
          fieldName: 'availableAmount',
          placeholder: '',
          disabled: true
        },
        {
          type: 'TEXT_AREA',
          label: '备注',
          fieldName: 'remark',
          selfCols: 3,
          maxlength: 200,
          placeholder: '请输入'
        }
      ];
    }
  }
};
</script>
